
<!--添加弹出框-->
<div class="wizard" id="wizard-demo">
    <form method="post" onsubmit="add()" id="addForm">
        <!--<h1>添加角色</h1>-->
        <div class="wizard-card" data-onValidated="setServerName" data-cardname="name">
            <h3 class="text-center"><span>添加角色</span></h3>

            <div class="wizard-input-section">
                <div class="form-group">
                    <label class="control-label" for="last-name">角色名 <span class="required">*</span>
                    </label>
                    <div>
                        <input type="text" id="last-name" name="role_name_add" required="required" class="form-control col-md-7 col-xs-12">
                    </div>
                </div>
            </div>
            <div class="wizard-input-section">
                <div class="form-group">
                    <label class="control-label" for="last-name">备注
                    </label>
                    <div>
                        <input type="text" name="remark_add" class="form-control col-md-7 col-xs-12">
                    </div>
                </div>
            </div>
            <div class="wizard-input-section">
                <div class="form-group">
                    <label for="middle-name" class="control-label">状态 <span class="required">*</span></label>
                    <div>
                        <select id="middle-name" class="form-control col-md-7 col-xs-12" name="status_add" required="required">
                            <option value="1" selected>正常</option>
                            <option value="0">禁用</option>
                        </select>
                    </div>
                </div>
            </div>
            <div class="wizard-input-section">
                <div class="form-group">
                    <label class="control-label" for="last-name">权限 <span class="required">*</span>
                    </label>
                    <div style="margin-left: 16px;margin-top: -6px;">
                        <div class="zTreeDemoBackground left form-group">
                            <ul id="treeAdd" class="ztree"></ul>
                            <input type="hidden" name="wid_add" value="">
                        </div>

                    </div>
                </div>
            </div>

        </div>

    </form>
</div>
<!--添加弹出框-->
<script src="__JS__/jquery.js"></script>
<!--ztree-->
<script type="text/javascript" src="__JS__/ztree/jquery.ztree.core.js"></script>
<script type="text/javascript" src="__JS__/ztree/jquery.ztree.excheck.js"></script>
<script type="text/javascript" src="__JS__/ztree/jquery.ztree.exedit.js"></script>
<script type="text/javascript">
    var setting = {
        view: {
            selectedMulti: true             /*允许选中多个节点*/
        },
        check: {
            enable: true,
            autoCheckTrigger: true
        },
        data: {
            simpleData: {
                enable: true
            }
        },
        edit: {
            enable: false
        }
    };
    setting.check.chkboxType = { "Y" : "s", "N" : "s" };

    var data = '{$jsonways}'
    data = JSON.parse(data);
    var zNodes = [];
    //console.log(data)
    var all = '全选';
    zNodes[data.length] = {id:0, pId:0, name:all, isParent:true,open:true}
    //console.log(zNodes)
    for(var i=0;i<data.length;i++){
        if(data[i].pid == '0'){
            zNodes[i] = {id:data[i].wid, pId:data[i].pid, name:data[i].w_name, isParent:true}
        }else{
            zNodes[i] = {id:data[i].wid, pId:data[i].pid, name:data[i].w_name}
        }
    }

    $(document).ready(function(){
        $.fn.zTree.init($("#treeAdd"), setting, zNodes);
        /*添加的*/
        var treeObj = $.fn.zTree.getZTreeObj("treeAdd");

        var nodes = treeObj.getChangeCheckedNodes()
        //nodes = Json
        //console.log(nodes)
        var tree = '';
        for(var i=0;i<nodes.length;i++){
            var treeNode = nodes[i]
            if(treeNode.checked == true){
                tree += treeNode.id + ',';
            }
            //console.log((treeNode?treeNode.name:"root") + "checked " +(treeNode.checked?"true":"false"));
        }
        $("input[name='wid_add']").val(tree)
    });

    var newCount = 1;
    function addHoverDom(treeId, treeNode) {
        var sObj = $("#" + treeNode.tId + "_span");
        if (treeNode.editNameFlag || $("#addBtn_"+treeNode.tId).length>0) return;
        /*var addStr = "<span class='button add' id='addBtn_" + treeNode.tId
            + "' title='add node' onfocus='this.blur();'></span>";
        sObj.after(addStr);*/
        var btn = $("#addBtn_"+treeNode.tId);
        if (btn) btn.bind("click", function(){
            var zTree = $.fn.zTree.getZTreeObj("treeAdd");
            zTree.addNodes(treeNode, {id:(100 + newCount), pId:treeNode.id, name:"new node" + (newCount++)});
            return false;
        });
    }
    function removeHoverDom(treeId, treeNode) {
        $("#addBtn_"+treeNode.tId).unbind().remove();
    }

    function addTree() {
        var treeObj = $.fn.zTree.getZTreeObj("treeAdd");
        var nodes = treeObj.getCheckedNodes();
        //console.log(nodes,'nodesnodesnodesnodes')
        /*var role_name = $("input[name='role_name']").val()
        var remark = $("input[name='remark']").val()
        var status = $("select[name='status']").val()*/

        var tree = '';
        for(var i=0;i<nodes.length;i++){
            var treeNode = nodes[i]
            if(treeNode.checked == true){
                tree += treeNode.id + ',';
            }
            //console.log((treeNode?treeNode.name:"root") + "checked " +(treeNode.checked?"true":"false"));
        }
        //console.log(tree)
        $("input[name='wid_add']").val(tree)

        //var jsonData = {'role_name':role_name,'remark':remark,'status':status,'wid':tree}
        //console.log(jsonData)
        //alert(jsonData)
        $.ajax({
            //几个参数需要注意一下
            type: "POST",//方法类型
            dataType: "json",//预期服务器返回的数据类型
            url: '' ,//url
            data: '',
            success: function (result) {

            }
        });
    }
    //console.log(setting.treeObj)
</script>
